/*
 初始化项目模块信息组件
 * @Author: duanguang 
 * @Date: 2020-10-29 16:46:25 
 * @Last Modified by: duanguang
 * @Last Modified time: 2020-10-30 18:15:06
 */
import React,{ Component } from 'react'
import { LegionsProPageContainer } from 'legions-pro-design';
import { InstanceProForm } from 'legions-pro-design/es/LegionsProForm/interface';
import { Button,Steps,Row,Col,Spin,} from 'antd';
import { ProjectFormFields } from '../../models/form/projectFormFields';
import { bind,observer } from 'legions/store-react'
import ProjectStore,{ TStepCurr } from '../../stores/projectStore';
import { directiveSend,directiveReceive } from '../../utils/socket';
import { WrappedFormUtils } from 'legions-pro-design/es/interface/antd';
import { ProjectModules,IDirective } from '../../interface/project';
import '../../assets/css/project.less'
import CreateProjectModule from '../project.module';
import { fullProvider,lazyInject,inject,legionsContainer } from 'legions-control-container';
import TerminalView from '../../../common/components/terminal';
import CreateProjectFormConfig from '../../components/form.config/createProjectFormConfig';
import { GIT_URL } from '../../constants/system/gitConfig';
interface IProps {
    store?: ProjectStore
}
@bind({ store: ProjectStore })
@observer
export default class ProjectInit extends Component<IProps,{}> {
    formRef: InstanceProForm = null
    form: WrappedFormUtils = null
    modalRef: InstanceProForm = null
    queryPrams = {}
    /** 项目模块表单配置类 */
    @lazyInject(CreateProjectFormConfig)
    projectModuleFormConfig!: CreateProjectFormConfig
    constructor(props: IProps) {
        super(props)
        /*  directiveSend({}) */
        directiveReceive((result) => {
            if (result && result.state) {
                this.props.store.projectEditViewModel.updateLoadingState(result.state)
            }
        })
    }
    /** 初始化仓库信息 */
    handleOnInit() {
        const createProjectFormRef = this.props.store.createProjectFormRef;
        const value = createProjectFormRef.viewModel.InputDataModel as ProjectFormFields;
        createProjectFormRef.viewModel.form.validateFields((err,values: ProjectFormFields) => {
            if (!err) {
                const model = ProjectFormFields.formFieldsToData<ProjectFormFields,ProjectModules.ISendData>(ProjectFormFields,value);
                const gitSrc = GIT_URL.replace('user',model.gitUserName).replace('pwd',model.gitPwd).replace('modules',model.modulesSystem[0]);
                model.gitSrc = gitSrc;
                directiveSend({
                    initProject: {
                        sendData: model,
                    },
                })
            }
            else {
                console.log(values,value,'不通过')
            }
        })
    }

    /** 数据转换 */
    onTransfrom = (value: IDirective['initProject']) => {
        return value.responseData.replace('client:','').replace(/state:error[\r\n]/g,'').replace('state:error','').replace('state:pending↵','')
            .replace('state:pending','').replace('state:complete↵','').replace('state:complete↵','').replace('state:complete','').replace('↵','')
    }
    /** 初始化仓库信息时，接收服务端返回信息 */
    onReceive = (resmessage: IDirective['initProject']) => {
        if (resmessage && resmessage.state) {
            this.props.store.projectEditViewModel.updateLoadingState(resmessage.state)
        }
    }
    render() {
        return (
            <div style={{ paddingTop: '10px' }}>
                <Spin spinning={this.props.store.projectEditViewModel.computedLoading}>
                    <Row>
                        <Col span={2 * 4}>
                            <CreateProjectModule controls={this.projectModuleFormConfig.createConfig}></CreateProjectModule>
                            <Col offset={2 * 4}>
                                {this.props.store.projectEditViewModel.computedLoad !== 'complete' && <Button type="primary" onClick={this.handleOnInit.bind(this)}>初始化</Button>}
                                {this.props.store.projectEditViewModel.computedLoad === 'complete' && <Button type="primary" onClick={() => {
                                    this.props.store.projectEditViewModel.stepCurr = 1;
                                    this.props.store.history.push('/luban/pj/edit')
                                }}>下一步</Button>}
                            </Col>
                        </Col>
                        {/* ====展示初始化仓库终端start===== */}
                        <Col span={3 * 5} offset={1}>
                            <TerminalView
                                <IDirective['initProject']>
                                style={{ marginTop: '10px' }}
                                onTransfrom={this.onTransfrom}
                                onSocketReceive={directiveReceive} onReceive={this.onReceive}></TerminalView>
                        </Col>
                        {/* ====展示初始化仓库终端end===== */}
                    </Row>
                </Spin>
            </div>
        )
    }
}